<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>


<div class="container-fluid">
	<div class="row-fluid">
		<div class="span12">
			<h3 class="page-title">部门管理</h3>
			<ul class="breadcrumb">
				<li>
					<i class="icon-home"></i>
					<a href="<c:url value="/home.html"/>">首页</a> 
					<i class="icon-angle-right"></i>
				</li>
				<li>
					<a href="<c:url value="/department/list.html"/>">部门管理</a>
					<i class="icon-angle-right"></i>
				</li>
				<li>
					<a href="#">新增部门</a>
				</li>
			</ul>
		</div>
	</div>
	
	<div class="row-fluid">
		<div class="span12">
			<div class="portlet box blue">
				<div class="portlet-title">
					<div class="caption"><i class="icon-bookmark"></i> 新增部门</div>
				</div>
				<div class="portlet-body form">
				
					<c:if test="${messageError!=null }">
					<div class="alert alert-error">
						<strong>错误!</strong> ${messageError }
					</div>
					</c:if>
				
					<form id="department-form" action="<c:url value="/department/save.html"/>" method="post" class="form-horizontal">
						<div class="alert alert-error hide">请检查下面的错误</div>
					
						<div class="control-group">
							<label class="control-label">部门名称:</label>
							<div class="controls">
								<input type="text" name="departmentName" class="m-wrap large">
							</div>
						</div>
						<div class="form-actions">
							<button class="btn blue" type="submit"><i class="icon-ok"></i> 保存</button>
							<a href="<c:url value="/department/list.html"/>" class="btn black" type="button"><i class="icon-share-alt"></i> 返回</a>
						</div>
					</form>
					
				</div>
			</div>
		</div>
	</div>

</div>


<script type="text/javascript">
$(document).ready(function(){
	var form = $("#department-form");
    var error = $(".alert-error", form);
    form.validate({
		errorElement : "span",
		errorClass: "help-inline",
		rules: {
			"departmentName": {
				required: true,
			}
		},
		messages: {
			"departmentName": {
				required: "请输入类型名称",
			}
		},
		invalidHandler: function (event, validator) { //display error alert on form submit              
            error.show();
            App.scrollTo(error, -200);
        },
        highlight: function (element) { // hightlight error inputs
            $(element).closest(".help-inline").removeClass("ok"); // display OK icon
            $(element).closest(".control-group").removeClass("success").addClass("error"); // set error class to the control group
        },
        unhighlight: function (element) { // revert the change dony by hightlight
            $(element).closest(".control-group").removeClass("error"); // set error class to the control group
        },
        success: function (label) {
            label.addClass("valid").addClass("help-inline ok").closest(".control-group").removeClass("error").addClass("success"); // set success class to the control group
        },
        submitHandler: function (form) {
            form.submit();
        }
	});
});
</script>
